<template>
  <BaseCard>
    <UiTable :tableData="list" v-bind="treeTableConfig">
      <template #handleTableSlot="scope">
        <el-button type="primary" link @click="edit(scope.row)">
          编辑
        </el-button>
      </template>
    </UiTable>
  </BaseCard>
</template>

<script setup lang="js">
import { ref } from "vue"
import { treeTableConfig } from "./config/tree.table.config"

const list = [
  {
    id: 1,
    date: '2016-05-02',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1518 弄'
  },
  {
    id: 2,
    date: '2016-05-04',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1517 弄'
  },
  {
    id: 3,
    date: '2016-05-01',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1519 弄',
    children: [
      {
        id: 31,
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1519 弄'
      },
      {
        id: 32,
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1519 弄'
      }
    ]
  },
  {
    id: 4,
    date: '2016-05-03',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1516 弄'
  }
]

// 编辑
const edit = (row) => {
  console.log(`编辑方法执行了--->`, row)
}
</script>
<style scoped lang="scss"></style>